<template>

  <div>
    <Navigation ref="nav_ref" @callbackComponent="callbackComponent"/>
    <!-- 导航栏 -->
    <h1 class="text-hide ny_banner" v-for="(item,index) in banner" :key="index"
        :style="{background:'url('+item.url+') no-repeat center  50%/cover'}">公司新闻</h1>
    <!--- 主题内容部分 -->
    <div class="container ny_content">
      <div class="ny_nav">
        <div class="ny_nav_h">
          <div>
            <h2>咨讯动态</h2>
            <p>DYNAMIC INFORMATION</p>
          </div>
        </div>
        <div class="ny_nav_dqwz">
          当前位置：<span class="hidden-xs">咨讯动态></span>公司新闻
        </div>
      </div>
      <!-- 新闻内容部分 -->
      <Tabs  ref="new_ref" @callbackNew="callbackNew" />
    </div>
    <!-- 尾部 -->
    <Footer/>
  </div>
</template>

<script>
import Navigation from '../../components/Navigation'
import Footer from '../../components/Footer'
import Tabs from '../../components/tabs'
export default {
  name: 'index',
  components: {
    Navigation,
    Footer,
    Tabs
  },
  data () {
    return {
      banner: [],
    }
  },
  methods: {
    callbackComponent (params) {
      params.function && this[params.function](params.data)
    },
    callbackNew(params){
      params.function && this[params.function](params.data)
    },
    getNewDetail(data){
      sessionStorage.setItem('new_id',data)
      this.$router.push('/detail/dynamic_detail');
    },
    getBannerList (data) {
      this.banner = data.image
    },
  }
}
</script>


<style>
/*带背景的分页按钮背景色begin*/
.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #C4181F;
  color: #FFF;
}
.el-pagination.is-background .el-pager li.active {
  color: #fff;
  cursor: default;
}
.el-pagination.is-background .el-pager li:hover {
  color: #C4181F;
}
.el-pagination.is-background .el-pager li:not(.disabled):hover {
  color: #C4181F;
}
.el-pagination.is-background .el-pager li:not(.disabled).active:hover {
  background-color: #C4181F;
  color: #FFF;
}
li.el-select-dropdown__item.selected {
  color: #C4181F;
}

/*设置当前页码的样式，及鼠标移上其他页码时的样式,以及左右箭头鼠标移上的样式*/

.el-select .el-input.is-focus .el-input__inner,
.el-pagination__sizes .el-input .el-input__inner:hover,
.el-select .el-input__inner:focus {
  border-color: #C4181F;
}
.el-pager li.active,.el-pager li:hover,
.el-pagination button:hover {
  color: #C4181F;
}
/*带背景的分页按钮背景色end*/
</style>
